<%@ page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="/mytags" prefix="q" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>进销存管理系统-客户列表</title>
<link rel="stylesheet" href="${ctx}/bootstrap3/css/bootstrap.min.css">
<link rel="stylesheet" href="${ctx}/css/my.css">
</head>
<body>
	<!-- 导航条 -->
	<jsp:include page="/mng/nav.jsp"/>
	<!-- /导航条 -->
	
	<!-- 主容器 -->
	<div class="container" style="margin-top: 76px">
	  <div class="row">
		<!-- 功能菜单 -->
		<jsp:include page="/mng/menu.jsp"/>
		<!-- /功能菜单 -->
		
		<!-- 主界面 -->
		<div id="main" class="main col-md-9">
			<!-- 路径导航 -->
			<ol class="breadcrumb" style="border-radius: 0;background: #fff;">
			  <li><a href="${ctx}/mng/main.jsp">首页</a></li>
			  <li><a href="#">基础数据管理</a></li>
			  <li class="active">客户管理</li>
			</ol>
			<!-- /路径导航 -->
			
			<!-- 查询表单 -->
			<div class="row">
			<form action="${ctx}/mng/cust/findByName.jhtml" method="post" class="form-horizontal" role="form">
				<div class="form-group">
					<label class="col-md-2 control-label">按条件查询</label>
					<div class="col-md-5">
		      			 <input type="text" name="condition" class="form-control"  placeholder="按客户名查询">
		    		</div>	
		   			<div class="col-md-1">
		   				<button type="submit" class="btn btn-primary">开始查询</button>
		   			</div>
				</div>
			</form>
			</div>
			<!-- /查询表单 -->
			
			<!-- 数据表格 -->
			<table class="table table-bordered table-striped table-hover">
			 <thead>
			    	<tr>
						<th>编号</th>
						<th>客户名称</th>
						<th>地址</th>
						<th>联络人</th>
						<th>电话</th>
						<th>邮政编码</th>
						<th>电子邮件</th>       
						<th>备注</th>
						<th>操作</th>
					</tr>
			    </thead>
			    <tbody>
					<c:forEach items="${pager.content}" var="cust">
					<tr>
						<td>${cust.id}</td>
						<td>${cust.lname}</td>
						<td>${cust.address}</td>
						<td>${cust.contact}</td>
						<td>${cust.tel}</td>
						<td>${cust.code}</td>
						<td>${cust.email}</td>
						<td>${cust.remark}</td>
						<td><a href="${ctx}/mng/cust/detail.jhtml?id=${cust.id}&number=${pager.number}"><span class="glyphicon glyphicon-edit">编辑</span></a>
						<a href="${ctx}/mng/cust/ajaxdelete.jhtml?id=${cust.id}&number=${pager.number}" class="del"><span class="glyphicon glyphicon-remove">删除</span></a>
						</td>
					</tr>
					</c:forEach>
			    </tbody>
			</table>
			<!-- /数据表格 -->
			
			<!-- 分页 -->
			<div class="row">
				<div class="col-md-2">
					<a class="btn btn-primary" href="${ctx}/mng/cust/add.jsp">新增客户</a>
				</div>
				<div class="col-md-10">
				<!-- 使用自定义标签 -->
				<q:pager totalElements="${pager.totalElements}" 
						 number="${pager.number}"
						 size="${pager.size}"
						 url="${ctx}/mng/cust/list.jhtml"/>
				</div>
			</div>
			<!-- /分页 -->
			
		</div>
		<!-- /主界面 -->
	  </div>
	</div>
 
<!-- 模态框 -->
<div class="modal fade" id="yourModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel"><span class="glyphicon glyphicon-warning-sign" style="color:#cc0000;"> 删除确认</span></h4>
      </div>
      <div class="modal-body">
      	 <h5 id="display">不可恢复删除，您确定吗？</h5>
      </div>
      <div class="modal-footer">
       	<a type="submit" id="doDel" class="btn btn-primary"
		href="${ctx}/mng/cust/list.jhtml" data-dismiss="modal">确认</a>
      </div>
    </div>
  </div>
</div>
<!-- /模态框 -->

<script src="${ctx}/js/jquery-1.11.1.min.js"></script>
<script src="${ctx}/bootstrap3/js/bootstrap.min.js"></script>
<script src="${ctx}/js/my.js"></script>
<script>
		$(document).ready(function() {
			$(".del").click(function() { //给本页面的所有的“删除”超链接添加“点击事件”处理函数
				var href = $(this).attr("href"); //获取当前点击的超链接的href值
				loadAjaxData(href);
				$("#yourModal").modal("show"); //显示模态框

				//当点击“确认”按钮时，执行一次性事件处理函数
				$("#doDel").one("click", function() {
					var h = $(this).attr("href");
					location.assign(h); //加载指定链接值的目标资源
				});

				return false; //阻止元素本身的默认行为
			});
		});
		function loadAjaxData(href) {//加载删除信息
			var s = href;
			$.post(s, null, function(json) {
				$("#display").html(json);
			}, "json");
		}
	</script>
</body>
</html>